<extend name='Public/demo' />
<block name='search'>
<li>
	<form action="{:U('index')}" method="get" id="search_form">
		<input style="font-size:12px;" type="text" class="form-control search" placeholder="用户名" name="search_username" id="search_username" value="{$Think.get.search_username}">
	</form>
</li>
</block>

<block name='contents'>
	<style>
		.table tr,.table td, table th{
			text-align: center;
		}
	</style>
	<div class="row">
		<div class="col-lg-12">
			<section class="panel">
				<!-- <h3 class="panel-heading" style="text-align:center">用户列表</h3> -->
				<div class="col-sm-12">
					<div id="sample_1_length" style="margin-top:10px;margin-left:10px">
						<label>
							<select size="1" name="prepage" aria-controls="sample_1" class="form-control" id="checkitem" form="search_form">
								<option value="5" <if condition="$Think.get.prepage eq 5">selected</if>>5</option>
								<option value="10" <if condition="$Think.get.prepage eq 10">selected</if>>10</option>
								<option value="20" <if condition="$Think.get.prepage eq 20">selected</if>>20</option>
								<option value="100" <if condition="$Think.get.prepage eq 100">selected</if>>100</option>
							</select>
						</label>
							条每页
						<label style="display:inline-block;margin-left:350px;font-size:22px;">管理员列表</label>
					</div>
				</div>
				<table class="table table-striped table-advance table-hover">
					<thead>
						<tr>
							<th> <i class="icon-location-arrow"></i>
								ID
							</th>
							<th> <i class="icon-bullhorn"></i>
								用户名
							</th>
							<th>
								<i class="icon-bookmark"></i>
								昵称
							</th>
							<th class="hidden-phone">
								<i class="icon-question-sign"></i>
								上次登录时间
							</th>
							<th class="hidden-phone">
								<i class="icon-question-sign"></i>
								上次登录IP
							</th>

							<th>
								<i class=" icon-edit"></i>
								管理组
							</th>

							<th>
								<i class=" icon-wrench"></i>
								操作
							</th>
						</tr>
					</thead>
					<tbody>
							<foreach name="res" item="vo">
							<tr>
								<td>{$vo.admin_id}</td>
								<td class="username">{$vo.username}</td>
								<td class="admin_name">{$vo.admin_name}</td>
								<td>
									<if condition="empty($vo['login_time'])">
										/
									<else />
										{$vo.login_time|date="Y-m-d h:i:s",###}
									</if>
								</td>
								<td>

									<if condition="empty($vo['login_ip'])">
										/
									<else />
										{$vo.login_ip}
									</if>
								</td>
								<td gid="{$vo.group_id}" class="group_id">{$vo.title}</td>
								<td class="butt">
									<a class="btn btn-primary btn-xs" href="{:U('edit', array('id'=>
										$vo['admin_id']))}">
										<i class="icon-pencil"></i>
									</a>
									<a href="{:U('delete', array('id'=>$vo['admin_id']))}" class="btn btn-danger btn-xs user_del">
										<i class="icon-trash "></i>
									</a>
								</td>
							</tr>
							</foreach>

					</tbody>
				</table>
			</section>
		</div>
	</div>
	<div class="row" style="margin-top:-10px">
		<style type="text/css">
					  #pages a,#pages span{ background-color: #fff;
							  border: 1px solid #ddd;
							  color: #337ab7;
							  float: left;
							  line-height: 1.42857;
							  margin-left: -1px;
							  padding: 6px 12px;
							  position: relative;
							  text-decoration: none;}
					  #pages span {
							background-color: #337ab7;
							border-color: #337ab7;
							color: #fff;
							cursor: default;
							z-index: 2;
							}
				  </style>

		<div class="col-sm-12 pull-right" >
			<div class="dataTables_paginate paging_simple_numbers pull-right" id="dataTables-example_paginate">
				<div id="pages" style="margin-right:25px">{$pages}</div>
			</div>
			<div class="dataTables_info pull-right" id="dataTables-example_info" role="status" aria-live="polite" style="margin-top:9px;margin-right:20px;">共{$allpage}页,当前第{$p}页,本页显示{$rows|default="0"}条记录,共{$total}条记录</div>
		</div>
	</div>
	<script>

		$(function(){

			// 每页显示条目, 选择后自动提交表单
			$('#checkitem').change(function(){
				$('#search_form').submit();
			});

			// 双击修改管理员用户名
			$('.username').dblclick(function(){
				var v = $(this).html();
				var inp = $('<input type="text" value="'+v+'" name="username" />')
				$(this).html(inp);
				inp.select();

				user = $(this);

				inp.blur(function(){
					var newV = $(this).val();
					var admin_id = $(this).parent().prev().html();
					$.ajax({
						url : '{:U("change")}',
						data : {admin_id:admin_id,username:newV},
						dataType : 'json',
						type : 'post',
						async : true,
						success : function(data){
							if (data == '1') {
								user.html(newV);
							}else{
								user.html(v);
								alert('修改失败');
							};
						}
					});
				});

			});

			// 双击修改管理员昵称
			$('.admin_name').dblclick(function(){
				var v = $(this).html();
				var inp = $('<input type="text" value="'+v+'" name="admin_name" />')
				$(this).html(inp);
				inp.select();

				user = $(this);

				inp.blur(function(){
					var newV = $(this).val();
					var admin_id = $(this).parent().prev().prev().html();
					$.ajax({
						url : '{:U("change")}',
						data : {admin_id:admin_id,admin_name:newV},
						dataType : 'json',
						type : 'post',
						async : true,
						success : function(data){
							if (data == '1') {
								user.html(newV);
							}else{
								user.html(v);
								alert('修改失败');
							};
						}
					});
				});

			});

			// 双击修改管理员组, 并提供下拉列表
			$('.group_id').dblclick(function(){
				var vtitle = $(this).html();
				var v = $(this).attr('gid');

				str = '<select name="admin_id">';
				<?php  foreach($group_list as $v){ ?>
					if (<?php echo $v['id'] ?>==v) {
						select = 'selected';
					}else{
						select = '';
					}
					str += '<option value="<?php echo $v['id'] ?>"  '+select+'><?php echo $v['title'] ?></option>';
				<?php }  ?>
				str += '</select>'

				var sel = $(str);
				$(this).html(sel);

				group = $(this);

				// 当选择管理员组, 发送ajax, 若选择的管理员组没变, 则要点击同列单元格取消下拉框
				sel.change(function(){
					var newV = $(this).val();
					var admin_id = $(this).parents('tr').find(':first-child').html();
					$.ajax({
						url : '{:U("change")}',
						data : {admin_id:admin_id,group_id:newV},
						dataType : 'json',
						type : 'post',
						async : true,
						success : function(data){
							if (data != '0') {
								group.html(data);
								group.attr('gid',newV);
							}else{
								group.html(vtitle);
								alert('修改失败');
							};
						}
					});
				});
			});

			$('th,td:not("td.group_id,td.username,td.admin_name,td.butt")').click(function(){

				var vtitle = $(this).parent().find('.group_id').html();
				var tdo = $(this).parent().find('.group_id');

				var m = $(vtitle).val();
				if (typeof(m) != 'undefined') {
					$.ajax({
						url : '{:U("getTitle")}',
						data : {group_id:m},
						dataType : 'json',
						type : 'post',
						async : true,
						success : function(data){
							tdo.html(data);
						}
					})
				};
				return false;
			});

			// 搜索用户名, 失去焦点是, 定位为第一页, 提交表单
			$('#search_username').blur(function(){
					$(this).parents('form').append('<input type="hidden" name="p" value="1">');
					$(this).parents('form').submit();
			});
		})
	</script>
</block>
